<template>
  <Form class="zlst-form--topline" v-model="fieldProperty" label-position="top">
    <setting-item-dispatcher
      v-for="(item, index) in formItemList"
      :key="index"
      :setting="setting"
      :field="item"
    />
  </Form>
</template>
<script type="text/javascript">
import listSetting from '../setting/setting-panel.js'
import SettingItemDispatcher from '../setting-panel-render/dispatcher'

export default {
  name: 'PanelField',
  components: { SettingItemDispatcher },
  data () {
    return {
      fieldProperty: {}
    }
  },
  props: {
    formProperty: {
      type: Object,
      default () {
        return {}
      }
    },
    setting: {
      type: Object,
      default () {
        return {}
      }
    }
  },
  computed: {
    formItemList () {
      return listSetting[this.setting.type]
    }
  }
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
</style>
